Kamwoo blog

객체, 클래스를 위한 타입을 지정한다.
구현없이 프로퍼티, 메소드 등을 명시만 해놓는 객체
implements로 상속 받는다.

1interface shape{
2	getArea(): number;
3}
4
5class Rect implements shape {
6	width: number;
7	height: number;
8
9	constructor(width, height) {
10		this.width = width;
11		this.height = height;
12	}
13}
14
15type Person {
16	name: string;
17	age?: number;
18}
19
20const person: Person = {
21	name: "loopy";
22	age: 20;
23}

특징

implements를 하지않은 클래스라도 명시된 프로퍼티, 메소드가 구현되어 있으면 같은 객체로 본다.
옵셔널 프로퍼티를 가진다.
interface대로 구현한 메소드는 타입을 명시할 필요는 없다.

interface끼리 extends를 통해 상속을 할 수 있다.

type alias와 다른점은 interface는 중복된 선언을 할 수 있고, type은 에러가 난다.

interface를 구현하는 객체는 옵셔널을 제외한 모든 추상 메소드를 구현해야한다.
매개변수에도 interface를 설정할 수 있고, 정의된 요구 사항을 모두 충족해야한다.

꼭 implements가 아니라, 객체 리터럴에도 interface를 설정할 수 있다.

1interface OnInitInterface {
2  onInit():void;
3  initialize():void;
4}
5
6const o:OnInitInterface = {
7  onInit():void { console.log('onInit 라이프 사이클') },
8  initialize():void { console.log('객체 초기화') }  
9};

옵셔널(?)로 선택적으로 구현할 수 있다.

readonly를 표기하여 초기값을 설정하고 변경하지 못하게 할 수 있다.

1interface Notebook { 
2  readonly CPU: string; 
3  readonly RAM: string;
4};
5
6let mackbook:Notebook = { 
7  CPU: '2.9GHz 코어 i9',
8  RAM: '32GB'
9};
10
11// [오류]
12// 'RAM'은 읽기 전용 속성 또는 상수로 변경할 수 없습니다.
13// (property) Notebook["RAM"]: string
14macbook.RAM = '128GB';

시그니처

클래스에 implements를 한다면 interface에서 새로운 속성, 메소드를 추가할 수 있지만, 객체 리터럴에서는 추가할 수 없다.

해결하는 방법으로 인덱스 시그니처 속성을 선언한다.

1interface ButtonInterface {
2  onInit?():void;
3  onClick():void;
4  // 인덱스 시그니처
5  [prop:string]: any;
6}
7
8const button:ButtonInterface = {
9  type: 'button',
10  disabled: false,
11  onClick() { console.log('버튼 클릭') }
12};

함수 타입

interface는 객체 뿐만 아니라 함수로 설정할 수 있다. 매개변수, 리턴값의 타입을 설정하면 구현하는 함수에는 타입을 표기하지 않아도 된다.

1// 펙토리얼 함수 인터페이스 정의
2interface FactorialInterface {
3  (n: number): number;  
4}
5
6// 인터페이스를 함수 타입에 설정했기에 별도의 매개변수, 리턴 값 설정을 생략해도 됩니다.
7const facto: FactorialInterface = (n) => {
8  if (n === 0) { return 0; }
9  if (n === 1) { return 1; }
10  return n * facto(n - 1);
11};

설정을 받은 상태에서 임의로 타입을 변경하면 에러가 발생한다.

typescript interface